<script  lang="ts">
  export default {
    name:'Prison',
    data(){
      return {
        name:'张三',
        age:18,
        tel:1888888888
      }
    },
    methods:{
      changeName(){
        this.name='zhang-san'
      },
      changeAge(){
        this.age =this.age +1
      },
      seeTel(){
        alert(this.tel)
      }
    },

  }
</script>

<template>
  <div class="prisonBox">
    <div>姓名：{{name}}</div>
    <div>年龄：{{age}}</div>
    <button @click="changeName">修改姓名</button>
    <button @click="changeAge">修改年龄</button>
    <button @click="seeTel">查看联系方式</button>
  </div>
</template>

<style scoped>
    .prisonBox{
      background-color:skyblue;
      padding: 20px;
      box-shadow: 0 0 10px;
      font-size: 20px;
      border-radius: 20px;
      button{
        margin: 0px 10px;
      }
    }
</style>